<!--
	作者：956911785@qq.com
	时间：2018-10-18
	描述：审核
-->

<template>
	<Modal title="查看" v-model="modal0" width="800px">
		
		<Tabs type="card">
	        <TabPane label="辅导班信息">
	        	<Form :label-width="100" label-position="left">
					<div style="width:100%;height: 300px; overflow-y: scroll;float:left;">
				     
				      	<div style="width:100%;height: 60px;line-height: 60px;float:left;">
				        	<div style="width: 100%;text-align: left;float: left;" align="left">
						        <FormItem label="辅导班名称:">
						        	<label>{{params.mc}}</label>
				        		</FormItem>
				        	</div>
				        </div>
		
						<div style="width:100%;height: auto;float:left;">
				        	<FormItem label="辅导班简介:">
				        		<p>{{params.jj}}</p>
		        			</FormItem>
				        </div>
		
						<div style="width:100%;height: 60px;line-height: 60px;float:left;">
				        	<div style="width: 50%;text-align: left;float: left;" align="left">
						        <FormItem label="费用:">
						        	<p>{{params.fy}}</p>
				        		</FormItem>
				        	</div>
				        	<div style="width: 50%;text-align: left;float: left;" align="left">
						        <FormItem label="人员限额:">
						        	<p>{{params.xe}}</p>
				        		</FormItem>
				        	</div>
				        </div> 
				        
				        <div style="width:100%;height: 60px;line-height: 60px;float:left;">
				        	<div style="width: 50%;text-align: left;float: left;" align="left">
						        <FormItem label="授课时间:">
						        	<p>{{params.sksj}}</p>
				        		</FormItem>
				        	</div>
				        	<div style="width: 50%;text-align: left;float: left;" align="left">
						        <FormItem label="授课地点:">
						        	<p>{{params.skdd}}</p>
				        		</FormItem>
				        	</div>
				        </div> 
				        
				        <div style="width:100%;height: 60px;line-height: 60px;float:left;">
				        	<div style="width: 90%;text-align: left;float: left;" align="left">
						        <FormItem label="报名资料说明:">
						        	<p>{{params.bmzlsm}}</p>
				        		</FormItem>
				        	</div>
				       </div> 

					</div> 
			    </Form>
	        </TabPane>
	        
	        <TabPane label="其他项目费用">
	         	<div v-for="(xm, index) in params.xms"  style="width:100%;float: left;overflow: hidden;border-top: 1px solid #ebebeb;padding-top:8px;padding-bottom:8px;">
	        		<div style="width:100%;float: left;">
	        			<label style="padding-left:3%;float:left;width:70%;">项目名称：{{xm.xmmc}}</label>
	        			<label style="padding-left:3%;float:left;width:20%;">费用：{{xm.fee}}</label>
	        		</div>
	        	</div>
	         </TabPane>
	         
	        <TabPane label="辅导教师">
	         	<div v-for="(te, index) in params.tes"  style="width:100%;float: left;overflow: hidden;border-top: 1px solid #ebebeb;padding-top:8px;padding-bottom:8px;">
	        		<div style="width:100%;float: left;">
	        			<label style="padding-left:3%;float:left;width:20%;">教师姓名：{{te.tname}}</label>
	        			<label style="padding-left:3%;float:left;width:70%;">简介：{{te.jianjie}}</label>
	        		</div>
	        	</div>
	         </TabPane>
	         
	        <TabPane label="学生信息">
	        	<Form :label-width="100" label-position="left">
		        	<div style="width:100%;height: 300px; overflow-y: scroll;float:left;">
				        <div style="width:100%;height: auto;overflow: hidden;float:left;">
						    <div class="demo-upload-list" v-for="item in params.photos">
					            <img :src="item.url">
					            <div class="demo-upload-list-cover">
					                <Icon type="ios-eye-outline" @click.native="handleView(item.url)"></Icon>
					            </div>
						    </div>
						    <Modal title="浏览图片" v-model="visible">
						        <img :src="imgurl" v-if="visible" style="width: 100%">
						    </Modal>
					    </div> 
					    
				        <div style="width:100%;height: auto;float:left;">
				        	<FormItem label="其它说明:">
				        		<template v-if="params.bmqksm">
				        			<P>{{params.bmqksm}}</P>
				        		</template>
				        		<template v-else>
				        			<P>无</P>
				        		</template>
		        			</FormItem>
				        </div>
				    </div> 
	        	</Form>
	        </TabPane>
	        
	        <TabPane label="学生缴费的项目">
	         	<div v-for="(jfs, index) in params.jfxms"  style="width:100%;float: left;overflow: hidden;border-top: 1px solid #ebebeb;padding-top:8px;padding-bottom:8px;">
	        		<div style="width:100%;float: left;">
	        			<label style="padding-left:3%;float:left;width:70%;">项目名称：{{jfs.xmmc}}</label>
	        			<label style="padding-left:3%;float:left;width:20%;">费用：{{jfs.fee}}</label>
	        		</div>
	        	</div>
	         </TabPane>
	         
	    </Tabs>
    
    
	   	<div slot="footer">
	    	<Button type="text"  @click="closeModal()">取消</Button>
	    </div>
     </Modal>
</template>

<script>
	
	export default {
		name:"shenhe",
		props: {
    		params:{
    			type:Object,	
    			default: function() {
					return null
				}
    		},
    	},
		data() {
			return {
                imgurl: '',
                visible: false,
                modal0:false,
			}
		},
		components: {
		},
		methods: {

            closeModal(){
	      	    this.modal0 = false;
	        },
	       
			handleView (imageurl) {
                this.visible = true;
                this.imgurl=imageurl;
            },
	        
		},
		mounted() {

		},
		watch:{
			modal0(news,olds){
				
			}
		},
		computed: {
			
		}
		
	}
</script>

<style scoped="scoped">
	 .demo-upload-list{
        display: inline-block;
        width: 100px;
        height: auto;
        text-align: center;
        line-height: 60px;
        border: 1px solid transparent;
        border-radius: 4px;
        overflow: hidden;
        background: #fff;
        position: relative;
        box-shadow: 0px;
        margin-right: 4px;
        float:left;
        margin-left: 4px;
    }
    .demo-upload-list img{
        width: 100%;
        height: 100%;
    }
    .demo-upload-list-cover{
        display: none;
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        background: rgba(0,0,0,.6);
    }
    .demo-upload-list:hover .demo-upload-list-cover{
        display: block;
    }
    .demo-upload-list-cover i{
        color: #fff;
        font-size: 20px;
        cursor: pointer;
        margin: 0 2px;
    }
</style>



